<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<title>JavaManual</title>
	</head>

	<body>

		<!--空的page-->
		<div data-role="page" id="blank_page" style="background: black;"></div>

		<!-- 侧滑导航根容器 -->
		<div class="mui-off-canvas-wrap">
			<!-- 主页面容器 -->
			<div class="mui-inner-wrap">
				<!-- 菜单容器 -->
				<aside class="mui-off-canvas-right">
					<div class="mui-scroll-wrapper">
						<div class="mui-scroll">
							<!-- 菜单具体展示内容 -->
							<div id="slide_toolbar">
								<div class="sub_child">
									<img id="feedback" src="img/icon/submit_proposal_normal.png" />
									<br />
									<span>反馈</span>
								</div>
								<!--<div class="sub_child">
									<img id="support" src="img/icon/help_information_normal.png" />
									<br />
									<span>帮助</span>
								</div>-->
								<div class="sub_child">
									<img id="about_us" src="img/icon/main_about_normal.png" />
									<br />
									<span>关于</span>
								</div>
								<div class="sub_child">
									<img id="hide_aside" src="img/icon/aside_back.png" />
									<br />
									<span>返回</span>
								</div>
							</div>
						</div>
					</div>
				</aside>

				<!-- 主界面具体展示内容 -->
				<div class="mui-content mui-scroll-wrapper" style="background: url(img/background/bg01.jpg) 50% 50% no-repeat;background-size:cover;">
					<div id="mainpage" class="mui-scroll">
						<div id="mui-backdrop" class="mui-backdrop" style="z-index: 99999;display: none;"></div>
						<!--标题栏-->
						<div id="title-block">
							<!--<span class="head-title ">JavaManual4h5 ---（www.bestick.cn）</span>-->
							<img src="img/string/main_screen_logo.png" />
						</div>
						<!--swiper 容器层-->
						<div class="swiper-container">
							<!--swiper划动层-->
							<div class="swiper-wrapper">

								<!--划屏页面一-->
								<div class="swiper-slide">
									<!--内容页-->
									<div data-role="content" style="padding: 0;">
										<!--第一行-->
										<div class="ui-grid-b">
											<div id="javabasic" class="main-block">
												<div class="javabasic">
													<img src="img/string/javabasic.png" />
													<br />
												</div>
												<span class="ico-title">Java 基础</span>
											</div>
											<div id="arithmetic" class="main-block">
												<div class="arithmetic">
													<img src="img/string/arithmetic.png" />
												</div>
												<span class="ico-title">算法与编程</span>
											</div>
										</div>

										<!--第二行-->
										<div class="ui-grid-b">
											<div id="java_advance" class="main-block">
												<div class="java_advance">
													<img src="img/string/java_advance.png" />
													<br />
												</div>
												<span class="ico-title">Java 进阶</span>
											</div>
											<div id="designpattern" class="main-block">
												<div class="designpattern">
													<img src="img/string/designpattern.png" />
												</div>
												<span class="ico-title">设计模式</span>
											</div>
										</div>

										<!--第三行-->
										<div class="ui-grid-b">
											<div id="database" class="main-block">
												<div class="database">
													<img src="img/string/database.png" />
													<br />
												</div>
												<span class="ico-title">数据库</span>
											</div>
											<div id="javaweb" class="main-block">
												<div class="javaweb">
													<img src="img/string/javaweb.png" />
												</div>
												<span class="ico-title">Java Web</span>
											</div>
										</div>

										<!--第四行-->
										<div class="ui-grid-b">
											<div id="framework" class="main-block">
												<div class="framework">
													<img src="img/string/framework.png" />
													<br />
												</div>
												<span class="ico-title">流行框架</span>
											</div>
											<div id="javaee" class="main-block">
												<div class="javaee">
													<img src="img/string/javaee.png" />
												</div>
												<span class="ico-title">Java EE</span>
											</div>
										</div>
										<!--内容页结束-->
									</div>
									<!--划屏页面一结束-->
								</div>

								<!--划屏页面二-->
								<div class="swiper-slide">
									<!--内容页-->
									<div data-role="content" style="padding: 0;">
										<!--第一行-->
										<div class="ui-grid-b">
											<div id="javaapi" class="main-block">
												<div class="javaapi">
													<img src="img/string/javaapi.png" />
													<br />
												</div>
												<span class="ico-title">Java API</span>
											</div>
											<div id="javasamples" class="main-block">
												<div class="javasamples">
													<img src="img/string/javasamples.png" />
												</div>
												<span class="ico-title">Java 实例</span>
											</div>
										</div>

										<!--第二行-->
										<div class="ui-grid-b">
											<div id="interview" class="main-block">
												<div class="interview">
													<img src="img/string/interview.png" />
													<br />
												</div>
												<span class="ico-title">Java 面试宝典</span>
											</div>
											<div id="topics" class="main-block">
												<div class="topics">
													<img src="img/string/topics.png" />
												</div>
												<span class="ico-title">专题</span>
											</div>
										</div>

										<!--第三行-->
										<div class="ui-grid-b">
											<div id="docedit_large" class="main-block">
												<div class="docedit_large">
													<img src="img/string/docedit_large.png" />
													<br />
												</div>
												<span class="ico-title">我的文章</span>
											</div>
											<div id="home_default" class="main-block">
												<div class="home_default">
													<img src="img/string/home_default.png" />
												</div>
												<span class="ico-title">官方网站</span>
											</div>
										</div>

										<!--内容页结束-->
									</div>
									<!--划屏页面二结束-->
								</div>
								<!--swiper划动层结束-->
							</div>
							<!--swiper容器层结束-->
						</div>
						<!--导航栏-->
						<div class="toolbar-block">
							<!--工具栏-->
							<div class="toolbar-view">
								<img id="aside_toolbar" src="img/icon/main_menu_normal.png" />
								<img id="settings" src="img/icon/setting_normal.png" />
							</div>
							<!--留空-->
							<div class="navbar-blank"></div>
							<!--页码-->
							<div class="page-view">
								<img id="page-view" src="img/icon/main_page_one.png" />
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>

		<link rel="stylesheet" type="text/css" href="css/mui.min.css" />
		<link rel="stylesheet" type="text/css" href="css/style.css" />
		<link rel="stylesheet" type="text/css" href="css/swiper.3.1.2.min.css" />
		<link rel="stylesheet" href="css/jquery.mobile-1.4.5.css">
		<script src="js/mui.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/jquery.mobile-1.4.5.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/swiper.3.1.2.jquery.min.js" type="text/javascript"></script>
		<script src="js/service.js "></script>

	</body>

</html>